<%@ page language="java" import="java.util.*,java.sql.*,org.springframework.context.*,org.springframework.context.support.ClassPathXmlApplicationContext,table.*,table.node.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%> 
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String thispageurl = request.getContextPath() + "/Table.do?" +  request.getQueryString();

//just for sort [name-sort=asc/desc]
String sortString = "&s-";
int sortStringStart = thispageurl.indexOf(sortString);
String nextSortDirection = "asc";
if(thispageurl.indexOf("=asc",sortStringStart)>0){
  nextSortDirection = "desc";
}
String noSortUrl = thispageurl.replaceAll("&s-[\\w]+=[\\w]+","");
request.setAttribute("nextSortDirection",nextSortDirection);
request.setAttribute("noSortUrl",noSortUrl);

%>
<%
DataTable datatablev = null;
List<Col> colList = null;
Iterator et = null;
Col idCol = null;
if(request.getAttribute("datatablev") != null){
	  datatablev =  (DataTable) request.getAttribute("datatablev");  
    colList = datatablev.getColList();
    idCol = datatablev.getDataIdCol();
}
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><%if(null!=datatablev){out.print(datatablev.getDescription());} else {out.print("佛山市公路桥梁工程监测站");} %></title>
<link rel="Shortcut Icon" href="./favicon.ico" />
    <script type="text/javascript" src="./js/jquery.min.js"></script>
    <script type="text/javascript" src="./js/jquery-ui-1.8.5.custom.min.js"></script>
    <script type="text/javascript" src="./dataTables/media/js/jquery.dataTables.js"></script>
    <script type="text/javascript" src="./js/tb/tools.js"></script>
    <link rel="stylesheet" href="./css/smoothness/jquery-ui-1.8.5.custom.css" type="text/css" media="all">
    <link rel="stylesheet" href="./dataTables/media/css/demo_table_jui.css" type="text/css" media="all">
    <link rel="stylesheet" href="./css/tb.css" type="text/css" media="all">
    <style type="text/css">
      body{font-family: 宋体,serif;font-size:12px;}
      td{font-size:12px;line-height:18px}
    </style>
    <style type="text/css">
      #autoCompleteBox {min-width:200px;background:white;border: 1px #99F solid;color:#777;}
      #autoCompleteBox tr.selected {background:#99f;color:#000;}
    </style>
    <style type="text/css">
      div.relatedBox{
            max-width:500px;max-height:500px;position:absolute;overflow:auto;
            background-color:white;border:1px solid black;}
      div.relatedBox {}
    </style>
</head>
<body>
<div id="tabs">
  <!--选择显示表  -->
  <div id="tableSelectBox">
    <ul><c:forEach items="${tables}" var="table">
      <li><a href="../Table/Table.do?method=setDatatable&datatableName=<c:out value='${table.beanId}'/>" >
            <c:out value="${table.description}"/>
      </a></li>
    </c:forEach></ul>
  </div>
<div class="wrapper"></div>
<%if(null != datatablev){ %>
<c:if test="${not empty datatablev}">
  <c:set var="colList" value="${datatablev.colList}"/>
  <c:set var="idCol" value="${datatablev.dataIdCol}"/>
</c:if>
  <!--数据表-->
<div id="databox">
<!-- 数据表操作 -->
<div id="tableOperators">
<ul>
  <li><a href="./Table.do?method=setDatatable&datatableName=<%=datatablev.getDataTableName()%>">刷新</a></li>
  <c:if test="${datatablev.insertFlag}">
    <li><font id="insertButton">插入</font></li>
    <div class="popupForm" id="insertBox">
      <form action="./Table.do" method="post">
        <input type="hidden" name="" value=""/>
        <c:forEach var="dtCol" items="${colList}">
          <c:out value="${dtCol.descripes}"/><input type="text" name="${dtCol.name}" value=""/><br/>
        </c:forEach> 
        <input type="hidden" name="datatableName" value="<%=datatablev.getDataTableName()%>"/>
        <input type="hidden" name="method" value="insert"/>
        <input type="submit" value="插入"/>
      </form>
    </div>
    <script type="text/javascript">
      $("#insertButton").click(function(){$('#insertBox').dialog({ title: '插入新检测项目' });});
    </script>
  <li><font id="importTableButton">导入</font></li>
  </c:if>
  <li><a href="./Table.do?method=ToExcel&colAction=ToExcel&datatableName=<%=datatablev.getDataTableName()%>"">导出</a></li>
</ul>
</div>
<!-- 数据表 -->
  <table id="mainDataTable" class="datatable" datatableName="<%="" + datatablev.getDataTableName()%>">
    <thead>
      <tr>
        <!-- list data th -->
        <%for(int j=0; j < colList.size(); j++){
            Col col = colList.get(j);
            String noDisplay = "";
            if(col.getProperties()!=null&& col.getProperties().hasName("noDisplay")){
              noDisplay = "display:none;";
            }%>
          <th class="ui-state-default" fieldName="<%=col.getName()%>" colType="<%=col.getDataStruct()%>" style="<%=noDisplay%>">
            <div class="thOpContainerTitle"><%=col.getDescripes()%></div>
            <div class="thOpContainer" style="display:none;padding:5px;">
              <%if(col.getDataStruct()!=null && col.getDataStruct().equals("data")){%>
                  <div class="query" style="padding:5px;">
                  <input class="dataBox" type="text" value="" style="width: 100%;">
                  <div><font class="databutton">查询</font></div>
                  </div>
                  <div class="sort" style="padding:5px;">
                   <a href="${noSortUrl}&s-<%=col.getName()%>=<%=nextSortDirection%>">排序</a>
                  </div>
                  <div class="fresh" style="padding:5px;">
                   <a href="./Table.do?datatableName=<%=datatablev.getDataTableName()%>&method=run&colName=<%=col.getName()%>&colAction=fresh">刷新</a>
                  </div>
              <%}%>
              <c:if test="${dtCol.dataStruct eq 'data'}">
              </c:if>
            </div>
          </th>
        <%}%>
      </tr>
    </thead>
    <tbody>
      <%int index = 1;
        int size = idCol.getDataSize();
        for(index=0; index < size ; index++){%>
        <tr>
          <%for(int j=0; j < colList.size(); j++){
        	   Col col = colList.get(j);
             String noDisplay = "";
             if(col.hasProperty("noDisplay")){
            	 noDisplay = "display:none;";
             }
             
             %>
             <td colType="<%=col.getDataStruct()%>" <%if(col.hasProperty("dataId")){%>p-dataId="true"<%}%> style=" <%=noDisplay%> " ><%=col.getNode(index).traveler()%></td>
            <%}%>
        </tr>
      <%}%>
    </tbody>
  </table>

<!-- 导航框 -->
  <div id="NavigateBox">
    <ul><%
    SetDataParamenters p = new SetDataParamenters(request);
    int pageCount = datatablev.getPageCount(p);
    for(int iPage = 0; iPage < pageCount; iPage++){
      %><li><a href="<%=thispageurl.replaceAll("&start=[\\d]+","")%>&start=<%=iPage*p.getPageSize() %>"><%=iPage + 1 %></a></li><%
    }%></ul>
  </div>
<!-- 自动容器 -->
  <div id='autoCompleteContainer' visiable="false">
    <div id='insertRelatedBox' style="display: none;">
      <input id='insertRelatedData' type='text' value='' />
      <span id='insertRelatedButton'>添加</span>
      <div id='autoCompleteBox' style="position: absolute;">
        <table><tbody></tbody></table>
      </div>
    </div>
    <div id='deleteRelatedButton' style="display: none;">
      <span>删</span>
    </div>

    <script type="text/javascript" src="./js/tb/queryBox.js"></script>
    <script type="text/javascript" src="./js/tb/related.js"></script>
    <script type="text/javascript" src="./js/tb/deleteBox.js"></script>
    <script type="text/javascript" src="./js/tb/relatedBox.js"></script>
    <script type="text/javascript" src="./js/tb/acInput.js"></script>
    <script type="text/javascript" src="./js/tb/checkRowBox.js"></script>
  </div>
<!-- 导入容器 -->
  <div id='jspContainer'>
    <jsp:include page="./jsp/importTable.jsp"></jsp:include>

    <%if(datatablev.isModifyFlag()){//modifyBox%>
      <div style="display:none;" id="modifyInputBoxContainer">
        <input id="modifyInputBox" class="acInput" type="text" targetIDName="<%=idCol.getName()%>" style="width:98%;height:98%;text-align: left;"/>
      </div>
      <script type="text/javascript" src="./js/tb/modifyBox.js"></script>
    <%}%>
    <%if(datatablev.isDeleteFlag()){ //deleteBox%>
      <div class="popupForm" id = "deleteBox">
        <form action="./Table.do"  method="post">
          <input type="hidden" name="datatableName" value="" id="datatableName"/>
          <input type="hidden" name="<%=idCol.getName()%>" value="" id="id"/>
            <%for(et = colList.iterator();et.hasNext();){
            Col dtCol = (Col) et.next();%>
            <%=dtCol.getDescripes()%><input type="text" name="<%=dtCol.getName()%>" value=""/><br>
          <%}%>
            <input type="hidden" name="method" value="delete"/>
          <input type="submit" value="删除"/>
        </form>
        <script type="text/javascript" src="./js/tb/deleteBox.js"></script>
      </div>
    <%}%>
  </div>
<%}%> 
</div>
</div>

<script type="text/javascript">
  $(document).ready(function() {
    $('.datatable').dataTable( {
        "bPaginate": false,
        "bLengthChange": false,
        "bFilter": true,
        "bInfo": true,
        "bSort": false,
        "bAutoWidth": true,
        "bJQueryUI": true
    });
    $("#tableOperators").appendTo(".dataTables_wrapper .fg-toolbar:first");
    $("#NavigateBox").appendTo(".dataTables_wrapper .fg-toolbar:last");
  });
</script>
</body>
</html>
